<template>
	<view class="homePage" :data-theme="theme" :class="theme">
		<HeadCustom title=" " :isSpace="false" :isAppBtn="true" :isHome="true"></HeadCustom>
		<view class="" style="height: 96rpx;"></view>
		<view class="detail">
			<view class="school_back">
				<image src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/back.png" mode="widthFix"></image>
				<view class="school">
					<view class="school1">
						<!-- <img @click="goDetail('lgdx')" class="img_box" src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/lgdx.png" alt="" /> -->
						<img @click="goDetail('sfdx')" class="img_box" src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/sfdx.png" alt="" />
						<img @click="goDetail('gcxy')" class="img_box" src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/gcxy.png" alt="" />
					</view>
					<view class="school2">
						<img @click="goDetail('gsdx')" class="img_box" src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/gsdx.png" alt="" />
						<!-- <img @click="goDetail('kjxy')" class="img_box" src="https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/kjxy.png" alt="" /> -->
					</view>
				</view>
			</view>
			<view class="bottom_img"><img class="img_b" :src="bottomImg" alt="" /></view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			theme: getApp().globalData.appTheme,
			bottomImg: 'https://ebc-prod.cdn.benwunet.com/uni-static/img3.3.0/bottom.png'
			 // 'https://ebc-prod.cdn.benwunet.com/uni-static/activity-job/bottom.png'
		};
	},
	methods: {
		goDetail(type) {
			console.log(type);
			const obj = {
				type: type
			};
			this.$pageTo('/activities/activity', obj);
		}
	}
};
</script>

<style scoped lang="scss">
.homePage {
	height: 100vh;
	.detail {
		height: calc(100vh - 96rpx);
		display: flex;
		flex-direction: column;
		.school_back {
			flex: 1;
			position: relative;
			> image {
				width: 100%;
				margin-bottom: -6rpx;
			}
			.school {
				position: absolute;
				width: 100%;
				bottom: 100rpx;
				.img_box {
					width: 180rpx;
					height: 180rpx;
				}
				.school1 {
					display: flex;
					justify-content: space-around;
					padding: 20rpx 60rpx;
				}
				.school2 {
					margin-top: 20rpx;
					display: flex;
					justify-content: center;
					padding: 20rpx 170rpx;
				}
			}
		}
		.bottom_img {
			.img_b {
				width: 100%;
				margin-bottom: -4rpx;
			}
		}
	}
}
</style>
